webpack 베스트 프랙티스

vue-cli에서 제시하는 webpack 기본 설정은 지나치게 무겁고 복잡하다고 판단되어 좀더 가볍게 vue.js를 사용해보고자 한다.

원칙#

• 빌드해야 하는 분량을 줄이고 가급적 브라우저 내에서 할 수 있는 모듈 연동 방법을 사용한다.
• 중복 코드를 줄인다.
• Zen of Python을 가능한 한 따른다.
• ES6의 모듈과 브라우저 스크립트 라이브러리 모두를 자유롭게 사용할 수 있어야 한다.
• 트랜스파일된 코드를 정확하게 추적할 수 있어야 한다.
• 웹 브라우저의 스크립트 콘솔에서 원하는 자바스크립트 객체에 쉽게 엑세스할 수 있어야 한다.

프랙티스#

디렉토리 구조 및 핵심 파일#

• public
  • index.js
  • bundle.js
• src
  • index.css

Vue.js#

Root App 선언#